3.11 How to read user inputs?

    Another example: menu for TruQA
      • Sign In
      • Join
      • Forgot Password

  1. How to read user inputs?
    • What elements can be used to read data from the user?
      • <input>
        • Attributes
          • type: text, password, hidden, submit, button, reset, number, email, ... Read HTML Input Types for more types.
          • name - like a variable name or a property name
          • value - data read from the user
          • autocomplete
          • autofocus
          • readonly, disabled, size, maxlength, ...
        • Try all the examples in HTML Input Attributes.
        • When do you use 'hidden'?
      • <textarea>
      • <input type='radio'>
      • <input type='checkbox'>
      • <select> and <option>
      • <datalist> and <option>
      • Try all the examples in HTML Form Elements, HTML Input Types, and HTML Forms.
    • <input> like elements are similar to variables that have data type, name, and value
    • Just a question. Do you remember how to select elements using attributes in CSS? If you do not remember, study CSS Attribute Selectors.
    • Trial 1: Let's try to write the code to read username, password, and note from the user, when a button is clicked. For each input-like element, you can read 'name' and 'value' values in JS.


  2. How to automatically fill in an input field?
  3. How to hide user typing?

  4. Learning outcomes
    • How to read data from the user.